<template>
  <div>
    <a-row>
      <a-col :span="12"  class='mb20'>
          <a-input  placeholder="请输入名称"  class='w200'  v-model='search.keyWord'/>
          <a-button type="primary"  @click='pageInit()'>搜索</a-button>
      </a-col>
    </a-row> 
  <a-table :columns="columns" :dataSource="data"  :pagination="pagination"  :rowKey="record => record.code"  @change="handleTableChange">
    <span slot='orderNum'  slot-scope="text, record" >
      <a-button size='small' ><router-link :to='{path:"/order",query:{entCode:record.code}}'>查看</router-link></a-button>
    </span>
    <span slot='createTime'  slot-scope="text, record" >{{text | formatDate}}</span>
    <span slot="action" slot-scope="text, record">
      <router-link  :to='{path:"/agency/detail",query:{code:record.code}}' class='color-blue'>详情</router-link>
      <a-divider type="vertical" />
      <router-link  :to='{path:"/agency/edit",query:{code:record.code}}' class='color-blue'>编辑</router-link>
      <a-divider type="vertical" />
      <a-popconfirm title="确认删除当前数据？" @confirm="confirmDel(record.code)"   okText="确认" cancelText="取消">
          <a href="javascript:;"  class='color-red'>删除</a>
      </a-popconfirm>
    </span>
  </a-table>
  </div>
</template>

<script>
import  { entList,delEnt }  from  '@/api/customer/index'
export default {
  name: 'agency',
  data () {
    return {
        columns:[{
          title:'企业名称',
        dataIndex: 'name',
        key: 'name',
        slots: { title: 'customTitle' },        
      },   {
        title: '联系人',
        dataIndex: 'contact',
      },
      {
        title: '联系方式',
        dataIndex: 'mobile',
      },  
        {
        title: '订单',
        scopedSlots: { customRender: 'orderNum' }, 
      },{
        title: '创建时间',
        dataIndex:'createTime',
        scopedSlots: { customRender: 'createTime' },  
      },{
        title: '操作',
        key: 'action',
        scopedSlots: { customRender: 'action' },
      }],
    data:[],
    search:{
      supOrBuyer:'4',
      pageNo:1,
      pageSize:10,
      keyWord:''
    },
    pagination:{
          total:0,
          pageSize: 10,//每页中显示10条数据
          showSizeChanger: true,

          pageSizeOptions: ["10", "20"],//每页中显示的数据
          showTotal: total => `共有 ${total} 条数据`,  //分页中显示总的数据
        },                                                                                                
    }
  },
  created(){
    this.pageInit()
  },
  methods:{
     pageInit(){
        entList(this.search).then((res)=>{
            this.data = res.data.dataList
            this.pagination.total = res.data.totalRs
        })
     },
     confirmDel(code){
       delEnt(code).then((res)=>{
        if(res.data.flag == true){
          this.$message.success(res.data.msg)
          this.pageInit()
        }
       })
    },
      /*table页数变化*/
    handleTableChange (pagination, filters, sorter) {
        // console.log(pagination);
        this.search.pageNo = pagination.current
        this.search.pageSize =pagination.pageSize
        this.pageInit()
    },
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.ant-input{width: 200px;}
</style>
